import styled from 'styled-components'

const StyAll = styled.div`
margin-top:.11rem;
padding:.2rem .1rem;
background-color:#fff;
div{
  display:flex;
  p{
  color:#308bfe;
  }
}
ul{
  padding-top:.2rem;
  li{
    height:.58rem;
    display:flex;
    align-items:center;
    border-bottom:1px solid #ccc;
    img{
      height:.44rem;
      border-radius:.22rem;
    }
    >p{
      padding-left:.1rem;
    }
  }
}
`
const StyInfoUi = styled.div`
padding-top:.44rm;
background-color:#fff;
.heade{
   padding: .2rem .1rem 0  .1rem;
   display:flex;
   justify-content:space-between;
   align-items:center;
   margin-bottom:.42rem;
   >p{
     color:#308bfe;
   }
   .left{
      >h2{color:#999;}
      span{
        color:#999;
      }
   display:flex;
   align-items:center;
   .asd{
     padding-left:.1rem;   }
   .img{
     >img{
      height:.68rem;
      border-radius:.34rem;
     }
      }
      }
}

.content{
  padding: 0 .1rem;
  >h1{
    margin-bottom:.11rem;
    font-size:.18rem;
    color:#333;
  }
  >span{
    margin-top:.11rem;
    color:#999;
  }
  >p{
    margin-top:.11rem;
    font-size:.14rem;
  }
  .img{
    margin-top:.29rem;
    >img{
      height:1.03rem;
    }
  }
  >h2{
      margin:.22rem 0;
      color:#999;
    }
}
`
const StyZhouQi = styled.div`
      margin-top:.11rem;
      width:100%;
      background-color:#fff;
      h1{
        font-size:.15rem;
        padding-left:.1rem;
        padding-top:.18rem;
        padding-bottom:.25rem;
      }
      ul{
        width:150%;
        overflow-x:scroll;
        overflow-y:hidden;
        display:flex;
        align-items:center;
        padding-left:.1rem;
        li{
          height:.80rem;
          margin-right:.2rem;
          width:.6rem;
          text-align:center;
          flex-shrink: 0; //禁止收缩
          >div{
           width:.55rem;
           height:.55rem;
           text-align:center;
           line-height:.55rem;
           border-radius:.3rem;
           background-color:#fafafa;
           border:1px solid #CCC;
           color:#CCC;
          }
          >p{
          width:.6rem;
          text-align:center;
          color:#CCC;
          }
        }
      }

`

export {
  StyAll,
  StyInfoUi,
  StyZhouQi
}